<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../../css/reset.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/add.css"/>
</head>
<body>
<div id="app">
    <div class="header">
        <span>修改快递员信息</span>
    </div>
    <div class="content">
        <table>
            <tr>
                <td class="text-right">手机号码</td>
                <td class="content_right"><input id="courierPhone" class="input inline-input" placeholder="请输入手机号码">
                    <span id="findByCourierPhone" class="btn btn-info">立即查找</span></td>
            </tr>
        </table>
    </div>


    <div class="header">
        <span>查找信息如下(请直接在需要修改的选项内进行修改)</span>
    </div>
    <div class="content">
        <table>
            <tr>
                <td class="text-right">姓名</td>
                <td class="content_right"><input class="input" placeholder=""></td>
            </tr>
            <tr>
                <td class="text-right">手机号码</td>
                <td class="content_right"><input onblur="testCourierPhone()" id="userPhone" class="input"
                                                 placeholder=""></td>
            </tr>
            <tr>
                <td class="text-right">身份证号</td>
                <td class="content_right"><input onblur="testCourierIDCardNo()" id="idCard" class="input"
                                                 placeholder=""></td>
            </tr>
            <tr>
                <td class="text-right">密码</td>
                <td class="content_right"><input class="input" placeholder=""></td>
            </tr>
            <tr>
                <td class="text-right">状态</td>
                <td class="content_right">
                    <!--0 未登录,1 已登录,2 已挂失,3 已删除,4 已注销-->
                    <input type="radio" class="status" name="status" value="0">未登录
                    <input type="radio" class="status" name="status" value="1"> 已登录
                    <input type="radio" class="status" name="status" value="2"> 已挂失
                    <input type="radio" class="status" name="status" value="3"> 已删除
                    <input type="radio" class="status" name="status" value="4"> 已注销
                </td>
            </tr>
            <tr>
                <td></td>
                <td class="content_right"><span id="update" class="btn btn-info">立即修改</span> <span class="btn"
                                                                                                   id="resetBtn">重置</span>
                </td>
            </tr>
        </table>
    </div>
</div>
</body>
<script src="/qrcode/jquery2.1.4.js"></script>
<script src="/layer/layer.js"></script>
<script>
    /**
     * 判断身份证号码和电话号的有效性
     * 这里的声明必须到最开始
     * @type {boolean}
     */
    var flagPhone = false;
    var flagIdCard = false;

    function testCourierPhone() {
        var insertCourierPhone = /(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/;
        var phone = $.trim($('#userPhone').val());
        if (insertCourierPhone.test(phone)) {
            flagPhone = true;
        } else {
            layer.msg("输入的手机号无效!");
            return false;
        }
    }

    function testCourierIDCardNo() {
        var insertIdCard = /(^[1|2|3|4|5|6|7|8|9]\d{17}$)/;
        var idCard = $.trim($('#idCard').val());
        if (insertIdCard.test(idCard)) {
            flagIdCard = true;
        } else {
            layer.msg("输入的身份证号无效!");
            return false;
        }
    }

    $(".header:eq(1),.content:eq(1)").hide();
    var courierId = null;
    $(function () {
        $("#findByCourierPhone").click(function () {
            find(true);
        });

        $("#update").click(function () {
            if (flagPhone && flagIdCard) {
                var windowId = layer.load();
                $.getJSON("/courier/update.do", {
                    id: courierId,
                    courierName: $("input:eq(1)").val(),
                    courierPhone: $("input:eq(2)").val(),
                    courierIdCardNo: $("input:eq(3)").val(),
                    password: $("input:eq(4)").val(),
					status : $(".status:checked").val()
                }, function (data) {
                    layer.close(windowId);
                    layer.msg(data.result);
                    if (data.status == 0) {
                        $(".header:eq(1),.content:eq(1)").hide();
                    } else {
                        //更新失败
                    }
                })
            } else if (flagIdCard) {
                layer.msg("请输入有效的手机号!");
                return false;
            } else {
                layer.msg("请输入有效的身份证号码!");
                return false;
            }
        });

        //重置按钮执行操作
        $("#resetBtn").click(function () {
            find(false);
        });
    });

    function find(findFlag) {//
        var windowId = layer.load();
        var courierPhone = $("#courierPhone").val();
        //把信息发送给服务器 get请求获取数据
        $.getJSON("/courier/findByCourierPhone.do", {courierPhone: courierPhone}, function (data) {//data是mseeage
            layer.close(windowId);
            if (findFlag) {
                layer.msg(data.result);//弹窗提示查询得到的提示
            } else {
                layer.msg("已重置");//弹窗提示查询得到的提示
            }
            if (data.status == 0) {
                $(".header:eq(1),.content:eq(1)").fadeIn(1000);//淡入显示 对应的是hide()隐藏
                courierId = data.data.id;
                //设置的方法记住
                $("input:eq(1)").val(data.data.courierName);
                $("input:eq(2)").val(data.data.courierPhone);
                $("input:eq(3)").val(data.data.courierIdCardNo);
                $("input:eq(4)").val(data.data.password);
                switch (data.data.status) {
                    <!--0 审核中,1 待取件,2 已取件,3 已取消,4 已删除,5 异常-->
                    case 0:
                        $(".status:eq(0)").prop("checked", true);//选中下标为0的
                        break;
                    case 1:
                        $(".status:eq(1)").prop("checked", true);//选中下标为1的
                        break;
                    case 2:
                        $(".status:eq(2)").prop("checked", true);//选中下标为2的
                        break;
                    case 3:
                        $(".status:eq(3)").prop("checked", true);//选中下标为3的
                        break;
                    case 4:
                        $(".status:eq(4)").prop("checked", true);//选中下标为4的
                        break;
                    default:
                        break;
                }
            }
        });
    }

</script>
</html>
